<template>
  <div class="office">
    <Editor id="textareaEditor" v-model="content" :init="init" />
  </div>
</template>
<script setup>
import { ref } from 'vue';
import Editor from "@tinymce/tinymce-vue";
let content = ref("");
let init = {
  // 配置信息
  selector: "#textareaEditor",
  height: 800,
  min_height: 400,
  language_url: "/tinymce/langs/zh_CN.js", // 中文包的存放路径
  language: "zh_CN",
  skin_url: "/tinymce/skins/ui/oxide",
  content_css: "/tinymce/skins/content/default/content.min.css",
  plugins:
    "preview searchreplace autolink directionality visualblocks visualchars fullscreen image link media code codesample table charmap pagebreak nonbreaking anchor insertdatetime advlist lists wordcount help emoticons autosave autoresize",
  toolbar:
    "code undo redo restoredraft | cut copy paste pastetext | forecolor backcolor bold italic underline strikethrough link anchor | alignleft aligncenter alignright alignjustify outdent indent | \
    styleselect formatselect fontselect fontsizeselect | bullist numlist | blockquote subscript superscript removeformat | \
    table image charmap emoticons hr pagebreak print | fullscreen | bdmap indent2em lineheight formatpainter axupimgs",
  // toolbar_mode: 'none',

  // menubar: false,
  // resize: false,
};
</script>